<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Firework</title>
</head>
<style>
*{
	padding: 0;
	margin: 0;
}
  #example{
    position: fixed;
    z-index: -1;
  }
</style>
<body>

<div id="example"></div>
<div id="aaa">
  <h2 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; color: rgb(51, 51, 51); font-size: 31px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px; white-space: normal;">
    2017<span class="anchor-target" id="year_2017" style="position: absolute; margin-top: -80px; padding-top: 80px;"></span><a href="http://xiaokedada.com/#year_2017" name="year_2017" class="anchor glyphicon glyphicon-link" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: transparent; position: absolute; top: auto; font-family: &quot;Glyphicons Halflings&quot;; font-size: 18px; padding: 10px 10px 10px 25px; width: 60px; margin-bottom: -3px;"></a>
  </h2>
  <h3 id="month_2017_July" style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: rgb(51, 51, 51); font-size: 24px; margin-top: 30px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px; white-space: normal;">
    July
  </h3>
  <div style="font-family: Gotham, &quot;Microsoft YaHei&quot;, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; white-space: normal;">
    <div class="breadcrumb clearfix" style="padding-left: 22px;">
      <div>
        <h3 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 13px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
          <a class="color-title" rel="nofollow" href="http://xiaokedada.com/2017/07/20/Clean-Code/" target="_blank" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: inherit; transition: all 0.3s; border-left: 6px solid rgb(111, 112, 113); padding-left: 12px; font-weight: 700;">编写自己的代码库</a>
        </h3>
      </div>
      <div class="excerpt" style="margin: 6px 0px 20px;">
        <p>
          做好基本总结，对于每一个程序员来讲都是重要的。最近看到一篇文章，文中说。
        </p>
        <blockquote style="border-left-width: 4px;">
          <p style="color: rgb(122, 122, 122); line-height: 1.25;">
            前端工程师要忘记前端二字。
          </p>
        </blockquote>
        <p>
          我深为折服，也颇为赞同。程序员所面临的无非是一个个问题，所做的也是解决一个一个难题。所谓语言、框架、工具、策略都是为了解决问题而服务的。很多人觉得JavaScript只能做一些写写脚本这一类前端的事，如果单纯这样去考虑，眼光未免太狭隘了。<span style="font-weight: 700;">JavaScript大有所为</span>，只有你想不到的，没有你做不到的，只有开拓语言的新应用范围，才能做到<span style="font-weight: 700;">创造力</span>，而不是单纯的紧跟时代所趋或追求于所谓的再创造力。
        </p>
        <p>
          周杰伦有一次接受采访，说，我从不关心流行，我创造流行(有待考据)。盲目去追求时代热潮也是不可取的，但这并不意味你要固步自封。良好的知识储备是必要的，是一切发展的基石。所以，不要看我们是前端程序员，算法、数据库、编译原理、操作系统等都应该具备。
        </p>
        <p>
          所以，勉励自己。
        </p>
      </div>
      <p>
        <span class="date-artical pull-left lh30" style="line-height: 30px; color: rgb(161, 161, 161); font-size: 12px;">July 20 , 2017&nbsp;<a class="tags-title" href="http://xiaokedada.com/tag/#Interview-ref" style="background: rgb(185, 200, 224); color: rgb(44, 77, 104); padding: 2px 4px; border-radius: 5px; margin-left: 18px;">Interview</a>&nbsp;</span><a class="btn btn-primary pull-right" rel="nofollow" href="http://xiaokedada.com/2017/07/20/Clean-Code/" target="_blank" style="background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(66, 139, 202); border-color: rgb(53, 126, 189); line-height: 1.42857; border-radius: 4px;">阅读全文</a>
      </p>
    </div>
    <hr/>
    <div class="breadcrumb clearfix" style="padding-left: 22px;">
      <div>
        <h3 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 13px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
          <a class="color-title" rel="nofollow" href="http://xiaokedada.com/2017/07/15/Flex/" target="_blank" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: inherit; transition: all 0.3s; border-left: 6px solid rgb(111, 112, 113); padding-left: 12px; font-weight: 700;">Flexbox的完全教程[翻译]</a>
        </h3>
      </div>
      <div class="excerpt" style="margin: 6px 0px 20px;">
        <p>
          文章翻译自<a href="https://css-tricks.com/" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">CSS-TRICKS</a>的<a href="https://css-tricks.com/snippets/css/a-guide-to-flexbox/" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">A Complete Guide to Flexbox</a>。本译文会在不破坏原文的基础上进行删除和修正。
        </p>
        <p>
          弹性盒布局(Flexbox Layout)旨在为容器(container)内的项目(item)的布局、对齐和空间分配提供一个更为便捷的方式，即便它们的尺寸是未知的或可变(弹性)的。
        </p>
        <p>
          它的主要思想是，让容器可以改变子元素(项目)的宽度和长度，从而充分地填充空间。一个弹性容器通过扩展子元素可以有效地填满自由空间，或者收缩它们以防止溢出。
        </p>
      </div>
      <p>
        <span class="date-artical pull-left lh30" style="line-height: 30px; color: rgb(161, 161, 161); font-size: 12px;">July 15 , 2017&nbsp;<a class="tags-title" href="http://xiaokedada.com/tag/#CSS-ref" style="background: rgb(185, 200, 224); color: rgb(44, 77, 104); padding: 2px 4px; border-radius: 5px; margin-left: 18px;">CSS</a>&nbsp;</span><a class="btn btn-primary pull-right" rel="nofollow" href="http://xiaokedada.com/2017/07/15/Flex/" target="_blank" style="background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(66, 139, 202); border-color: rgb(53, 126, 189); line-height: 1.42857; border-radius: 4px;">阅读全文</a>
      </p>
    </div>
    <hr/>
    <div class="breadcrumb clearfix" style="padding-left: 22px;">
      <div>
        <h3 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 13px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
          <a class="color-title" rel="nofollow" href="http://xiaokedada.com/2017/07/12/Angular-Third/" target="_blank" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: inherit; transition: all 0.3s; border-left: 6px solid rgb(111, 112, 113); padding-left: 12px; font-weight: 700;">Angular4第三课 -- 从Heroes的栗子看Angular</a>
        </h3>
      </div>
      <div class="excerpt" style="margin: 6px 0px 20px;">
        <p>
          Angular系列教程:
        </p>
        <ul style="margin-bottom: 10px;" class=" list-paddingleft-2">
          <li>
            <p>
              <a href="http://xiaokedada.com/2017/07/04/First-Meet-Angular" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">Angular4第一课 – 启动</a>
            </p>
          </li>
          <li>
            <p>
              <a href="http://xiaokedada.com/2017/07/06/Angular-Second" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">Angular4第二课 – 基本概念解析</a>
            </p>
          </li>
        </ul>
        <p>
          为了学习Angular，实现了主页教程的<code class="highlighter-rouge" style="font-size: 12.6px; font-family: monaco, Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; white-space: nowrap; color: rgb(139, 0, 139);">Heroes</code>例子。代码放在仓库<a href="https://github.com/maoxiaoke/Angular4-heroes" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">Angular4-heroes</a>下。但是，希望写单独为此写一篇的目的在于，这是一个非常好的例子，通过这个例子，我们可以详细地了解Angular有关<span style="font-weight: 700;">表单</span>、<span style="font-weight: 700;">服务</span>、<span style="font-weight: 700;">注入</span>、<span style="font-weight: 700;">HTTP</span>、<span style="font-weight: 700;">路由</span>等概念，所以非常值得初学者学习。
        </p>
      </div>
      <p>
        <span class="date-artical pull-left lh30" style="line-height: 30px; color: rgb(161, 161, 161); font-size: 12px;">July 12 , 2017&nbsp;<a class="tags-title" href="http://xiaokedada.com/tag/#Angular-ref" style="background: rgb(185, 200, 224); color: rgb(44, 77, 104); padding: 2px 4px; border-radius: 5px; margin-left: 18px;">Angular</a>&nbsp;</span><a class="btn btn-primary pull-right" rel="nofollow" href="http://xiaokedada.com/2017/07/12/Angular-Third/" target="_blank" style="background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(66, 139, 202); border-color: rgb(53, 126, 189); line-height: 1.42857; border-radius: 4px;">阅读全文</a>
      </p>
    </div>
    <hr/>
    <div class="breadcrumb clearfix" style="padding-left: 22px;">
      <div>
        <h3 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 13px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
          <a class="color-title" rel="nofollow" href="http://xiaokedada.com/2017/07/06/Angular-Second/" target="_blank" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: inherit; transition: all 0.3s; border-left: 6px solid rgb(111, 112, 113); padding-left: 12px; font-weight: 700;">Angular4第二课 -- 基本概念解析</a>
        </h3>
      </div>
      <div class="excerpt" style="margin: 6px 0px 20px;">
        <p>
          Angular系列教程:
        </p>
        <ul style="margin-bottom: 10px;" class=" list-paddingleft-2">
          <li>
            <p>
              <a href="http://xiaokedada.com/2017/07/04/First-Meet-Angular" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">Angular4第一课 – 启动</a>
            </p>
          </li>
          <li>
            <p>
              <a href="http://xiaokedada.com/2017/07/12/Angular-Third" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">Angular4第三课 – 从Heroes的栗子看Angular</a>
            </p>
          </li>
        </ul>
        <p>
          上一节中主要是介绍了Angular的启动和命令。这一节仍然是介绍基础概念，而且，而且，而且(重要的事情说三遍)，这一节也主要参考<a href="https://angular.io/guide/architecture" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">官网的这篇文章</a>，所以呢，大致会一样。
        </p>
      </div>
      <p>
        <span class="date-artical pull-left lh30" style="line-height: 30px; color: rgb(161, 161, 161); font-size: 12px;">July 6 , 2017&nbsp;<a class="tags-title" href="http://xiaokedada.com/tag/#Angular-ref" style="background: rgb(185, 200, 224); color: rgb(44, 77, 104); padding: 2px 4px; border-radius: 5px; margin-left: 18px;">Angular</a>&nbsp;</span><a class="btn btn-primary pull-right" rel="nofollow" href="http://xiaokedada.com/2017/07/06/Angular-Second/" target="_blank" style="background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(66, 139, 202); border-color: rgb(53, 126, 189); line-height: 1.42857; border-radius: 4px;">阅读全文</a>
      </p>
    </div>
    <hr/>
    <div class="breadcrumb clearfix" style="padding-left: 22px;">
      <div>
        <h3 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 13px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
          <a class="color-title" rel="nofollow" href="http://xiaokedada.com/2017/07/04/First-Meet-Angular/" target="_blank" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: inherit; transition: all 0.3s; border-left: 6px solid rgb(111, 112, 113); padding-left: 12px; font-weight: 700;">Angular4第一课 -- 启动</a>
        </h3>
      </div>
      <div class="excerpt" style="margin: 6px 0px 20px;">
        <p>
          Angular系列教程:
        </p>
        <ul style="margin-bottom: 10px;" class=" list-paddingleft-2">
          <li>
            <p>
              <a href="http://xiaokedada.com/2017/07/06/Angular-Second" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">Angular4第二课 – 基本概念解析</a>
            </p>
          </li>
          <li>
            <p>
              <a href="http://xiaokedada.com/2017/07/12/Angular-Third" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">Angular4第三课 – 从Heroes的栗子看Angular</a>
            </p>
          </li>
        </ul>
        <blockquote style="border-left-width: 4px;">
          <p style="color: rgb(122, 122, 122); line-height: 1.25;">
            One framework. Mobile &amp; desktop.<span style="position: relative; font-size: 10.5px; line-height: 0; vertical-align: baseline; top: -0.5em;"><a href="https://angular.io/" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">来源</a></span>
          </p>
        </blockquote>
        <p>
          而Angular是什么呢？我看到这句话
        </p>
        <blockquote style="border-left-width: 4px;">
          <p style="color: rgb(122, 122, 122); line-height: 1.25;">
            Angular is a platform that makes it easy to build applications with the web. Angular combines declarative templates, dependency injection, end to end tooling, and integrated best practices to solve development challenges.<span style="position: relative; font-size: 10.5px; line-height: 0; vertical-align: baseline; top: -0.5em;"><a href="https://angular.io/docs" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">来源</a></span>
          </p>
        </blockquote>
        <p>
          上面说，Angular是一个框架，还整合了声明式模板、依赖注入和端对端工具。具体点呢？
        </p>
      </div>
      <p>
        <span class="date-artical pull-left lh30" style="line-height: 30px; color: rgb(161, 161, 161); font-size: 12px;">July 4 , 2017&nbsp;<a class="tags-title" href="http://xiaokedada.com/tag/#Angular-ref" style="background: rgb(185, 200, 224); color: rgb(44, 77, 104); padding: 2px 4px; border-radius: 5px; margin-left: 18px;">Angular</a>&nbsp;</span><a class="btn btn-primary pull-right" rel="nofollow" href="http://xiaokedada.com/2017/07/04/First-Meet-Angular/" target="_blank" style="background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(66, 139, 202); border-color: rgb(53, 126, 189); line-height: 1.42857; border-radius: 4px;">阅读全文</a>
      </p>
    </div>
    <hr/>
    <div class="breadcrumb clearfix" style="padding-left: 22px;">
      <div>
        <h3 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 13px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
          <a class="color-title" rel="nofollow" href="http://xiaokedada.com/2017/07/01/First-Meet-TypeScript/" target="_blank" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: inherit; transition: all 0.3s; border-left: 6px solid rgb(111, 112, 113); padding-left: 12px; font-weight: 700;">TypeScript详解</a>
        </h3>
      </div>
      <div class="excerpt" style="margin: 6px 0px 20px;">
        <blockquote style="border-left-width: 4px;">
          <p style="color: rgb(122, 122, 122); line-height: 1.25;">
            TypeScript is a typed superset of JavaScript that compiles to plain JavaScript<span style="position: relative; font-size: 10.5px; line-height: 0; vertical-align: baseline; top: -0.5em;"><a href="http://www.typescriptlang.org/index.html" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">来源</a></span>.
          </p>
        </blockquote>
        <p>
          这意味着所有的<code class="highlighter-rouge" style="font-size: 12.6px; font-family: monaco, Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; white-space: nowrap; color: rgb(139, 0, 139);">ES6</code>代码都是完全有效的且可编译的TypeScript代码(通俗一点，就是任何合法的JavaScript程序都是合法的TypeScript程序)。
        </p>
        <p>
          <span style="font-weight: 700;">为什么我们需要使用TypeScript呢？</span>目前广泛应用的JavaScript标准还是ES5，在如今大规模JavaScript应用中，由于它缺乏很多必要的特性，一些可维护性问题就暴露出来了。ES6旨在解决上述可维护性问题，但并没有完全实现，其次该标准的广泛采用，也是个漫长的过程。TypeScript应运而生，其中类型检查是它的一个非常重要的特性。
        </p>
        <p>
          <span style="font-weight: 700;">如何学习TypeScript？</span>目前我推荐的是<a href="http://www.typescriptlang.org/index.html" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">官方的语言主页</a>和该语言开源仓库的<a href="https://github.com/Microsoft/TypeScript/wiki" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: rgb(67, 117, 158);">wiki主页</a>，我尤其推荐后者，非常便于学习和查询。
        </p>
      </div>
      <p>
        <span class="date-artical pull-left lh30" style="line-height: 30px; color: rgb(161, 161, 161); font-size: 12px;">July 1 , 2017&nbsp;<a class="tags-title" href="http://xiaokedada.com/tag/#TypeScript-ref" style="background: rgb(185, 200, 224); color: rgb(44, 77, 104); padding: 2px 4px; border-radius: 5px; margin-left: 18px;">TypeScript</a>&nbsp;</span><a class="btn btn-primary pull-right" rel="nofollow" href="http://xiaokedada.com/2017/07/01/First-Meet-TypeScript/" target="_blank" style="background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(66, 139, 202); border-color: rgb(53, 126, 189); line-height: 1.42857; border-radius: 4px;">阅读全文</a>
      </p>
    </div>
    <hr/>
    <h3 id="month_2017_June" style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 30px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
      June
    </h3>
    <ul style="margin-bottom: 10px;" class=" list-paddingleft-2">
      <div class="breadcrumb clearfix" style="padding-left: 22px;">
        <div>
          <h3 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 13px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
            <a class="color-title" rel="nofollow" href="http://xiaokedada.com/2017/06/27/Graph-theory/" target="_blank" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: inherit; transition: all 0.3s; border-left: 6px solid rgb(111, 112, 113); padding-left: 12px; font-weight: 700;">这一点点的图论基础</a>
          </h3>
        </div>
        <div class="excerpt" style="margin: 6px 0px 20px;">
          <p>
            图也是一种非线性的数据结构，是网络结构的抽象模型，是一组由<em>边</em>连接的<em>节点</em>。图的表示法:
          </p>
          <p>
            <code class="highlighter-rouge" style="font-size: 12.6px; font-family: monaco, Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; white-space: nowrap; color: rgb(139, 0, 139);">G = (V,E)</code>，其中<code class="highlighter-rouge" style="font-size: 12.6px; font-family: monaco, Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; white-space: nowrap; color: rgb(139, 0, 139);">V</code>表示一组节点，<code class="highlighter-rouge" style="font-size: 12.6px; font-family: monaco, Monaco, Menlo, Consolas, &quot;Courier New&quot;, monospace; white-space: nowrap; color: rgb(139, 0, 139);">E</code>表示一组边。
          </p>
          <p>
            图论的理解有点难度，这里也是介绍一些基本点，仅仅包括图的表示和遍历。因为图论又有好多图，实在是好累。
          </p>
        </div>
        <p>
          <span class="date-artical pull-left lh30" style="line-height: 30px; color: rgb(161, 161, 161); font-size: 12px;">June 27 , 2017&nbsp;<a class="tags-title" href="http://xiaokedada.com/tag/#Algorithms-ref" style="background: rgb(185, 200, 224); color: rgb(44, 77, 104); padding: 2px 4px; border-radius: 5px; margin-left: 18px;">Algorithms</a>&nbsp;</span><a class="btn btn-primary pull-right" rel="nofollow" href="http://xiaokedada.com/2017/06/27/Graph-theory/" target="_blank" style="background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(66, 139, 202); border-color: rgb(53, 126, 189); line-height: 1.42857; border-radius: 4px;">阅读全文</a>
        </p>
      </div>
      <hr/>
      <div class="breadcrumb clearfix" style="padding-left: 22px;">
        <div>
          <h3 style="font-family: Gotham, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif, &quot;Open Sans&quot;, &quot;Helvetica Neue&quot;, Helvetica, Arial, &quot;Microsoft YaHei&quot;, sans-serif; font-weight: 500; color: inherit; font-size: 24px; margin-top: 13px; margin-bottom: 15px; position: relative; padding-left: 60px; margin-left: -45px;">
            <a class="color-title" rel="nofollow" href="http://xiaokedada.com/2017/06/26/Tree/" target="_blank" style="background-image: initial; background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; color: inherit; transition: all 0.3s; border-left: 6px solid rgb(111, 112, 113); padding-left: 12px; font-weight: 700;">树的基础</a>
          </h3>
        </div>
        <div class="excerpt" style="margin: 6px 0px 20px;">
          <p>
            树也是一种非线性的数据结构。它对于存储需要快速查找的数据非常有用。有关树的常用术语有:
          </p>
          <ul class=" list-paddingleft-2">
            <li>
              <p>
                根节点，这个好理解，不多说
              </p>
            </li>
            <li>
              <p>
                子树，子树由节点和它的后代构成
              </p>
            </li>
            <li>
              <p>
                节点的深度，节点的深度取决于它的祖先节点的数量
              </p>
            </li>
            <li>
              <p>
                树的深度，就是所有节点深度的最大值
              </p>
            </li>
          </ul>
          <p>
            废话不多说，其实我们对这种结构还是理解挺多的。
          </p>
        </div>
        <p>
          <span class="date-artical pull-left lh30" style="line-height: 30px; color: rgb(161, 161, 161); font-size: 12px;">June 26 , 2017&nbsp;<a class="tags-title" href="http://xiaokedada.com/tag/#Algorithms-ref" style="background: rgb(185, 200, 224); color: rgb(44, 77, 104); padding: 2px 4px; border-radius: 5px; margin-left: 18px;">Algorithms</a>&nbsp;</span><a class="btn btn-primary pull-right" rel="nofollow" href="http://xiaokedada.com/2017/06/26/Tree/" target="_blank" style="background-position: 0px 0px; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(66, 139, 202); border-color: rgb(53, 126, 189); line-height: 1.42857; border-radius: 4px;">阅读全文</a>
        </p>
      </div>
      <div class="breadcrumb clearfix" style="padding-left: 22px;"></div>
    </ul>
  </div>
  <p>
    <br/>
  </p>
</div>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="firework.js"></script>
<script type="text/javascript">
	$(function(){
		$("#example").fireworks({
			width: "100%",
			height: "100%"
		});
	});
</script>

</body>
</html>